<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title></title>
		<style type="text/css">
			div{
				margin-top: 10px;
			}
		</style>
		
		<script src="https://apps.bdimg.com/libs/jquery/2.1.4/jquery.min.js"></script>
		<script>
			// 199000749许业娜
			$(function(){
				$('#search').click(function(){
					let phone = $('#phone').val();
					// alert(phone);
					$.ajax({
						type:"post",
						url: "http://api.k780.com/?app=phone.get&appkey=10003&sign=b59bc3ef6191eb9f747dd4e83c99f2a4&format=json",
						data:{"phone":phone},
						success:function(response){
							// console.log(response.result);
							let obj = response.result;
							// alert(obj.area);
							$("#area").text(obj.area);
							$("#postno").text(obj.postno);
							$("#ctype").text(obj.ctype);
							$("#att").text(obj.att);
							$("#operators").text(obj.operators);
						}
					})
				})
			})
		</script>
	</head>
	<body>
		<fieldset>
			<legend>查询收集归属地</legend>
			<div>
				<input type="text" id="phone" placeholder="请输入手机号" /> <button id="search">查询</button>
			</div>
			<div>
				<label>&nbsp;&nbsp;&nbsp;区号：</label><label id="area"></label>
			</div>
			<div>
				<label>&nbsp;&nbsp;&nbsp;邮编：</label><label id="postno"></label>
			</div>
			<div>
				<label>卡类型：</label><label id="ctype"></label>
			</div>
			<div>
				<label>归属地：</label><label id="att"></label>
			</div>
			<div>
				<label>运营商：</label><label id="operators"></label>
			</div>
		</fieldset>
	</body>
</html>
